<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>音频调试页面</title>
</head>
<body>
    <h1>音频调试页面</h1>
    <button id="testMic">测试麦克风</button>
    <button id="testRecord">测试录音</button>
    <button id="stopRecord">停止录音</button>
    <div id="status"></div>
    <div id="logs"></div>

    <script>
        let mediaRecorder = null;
        let localStream = null;
        const statusDiv = document.getElementById('status');
        const logsDiv = document.getElementById('logs');

        function log(message) {
            console.log(message);
            logsDiv.innerHTML += '<div>' + new Date().toLocaleTimeString() + ': ' + message + '</div>';
        }

        document.getElementById('testMic').onclick = async () => {
            try {
                localStream = await navigator.mediaDevices.getUserMedia({
                    audio: {
                        echoCancellation: true,
                        noiseSuppression: true,
                        autoGainControl: true,
                        sampleRate: 48000,
                        channelCount: 1
                    }
                });
                log('麦克风获取成功');
                statusDiv.textContent = '麦克风已获取';
            } catch (error) {
                log('麦克风获取失败: ' + error.message);
            }
        };

        document.getElementById('testRecord').onclick = () => {
            if (!localStream) {
                log('请先获取麦克风');
                return;
            }

            try {
                // 检查MediaRecorder支持
                const mimeTypes = [
                    'audio/webm;codecs=opus',
                    'audio/webm',
                    'audio/mp4',
                    'audio/ogg;codecs=opus'
                ];

                let selectedMimeType = null;
                for (const mimeType of mimeTypes) {
                    if (MediaRecorder.isTypeSupported(mimeType)) {
                        selectedMimeType = mimeType;
                        break;
                    }
                }

                log('支持的MIME类型: ' + selectedMimeType);

                mediaRecorder = new MediaRecorder(localStream, {
                    mimeType: selectedMimeType
                });

                mediaRecorder.ondataavailable = (event) => {
                    log('收到音频数据，大小: ' + event.data.size);
                    if (event.data.size > 0) {
                        const reader = new FileReader();
                        reader.onload = () => {
                            const base64 = reader.result.split(',')[1];
                            log('Base64数据长度: ' + base64.length);
                        };
                        reader.readAsDataURL(event.data);
                    }
                };

                mediaRecorder.onstart = () => {
                    log('录音已开始');
                };

                mediaRecorder.onerror = (event) => {
                    log('录音错误: ' + event.error);
                };

                mediaRecorder.start(1000);
                log('开始录音，MIME类型: ' + mediaRecorder.mimeType);

            } catch (error) {
                log('录音失败: ' + error.message);
            }
        };

        document.getElementById('stopRecord').onclick = () => {
            if (mediaRecorder && mediaRecorder.state === 'recording') {
                mediaRecorder.stop();
                log('录音已停止');
            }
        };
    </script>
</body>
</html>
